const wl = window.localStorage
const wlget = res => {
	return wl.getItem(res)
}
const wlset = (res, val) => {
	wl.setItem(res, val)
}
const state = {
	curFormInfo: null, //当前自定义表单数据
	curScreenInfo: null, //当前自定义大屏数据
	isCollapse: false,
	bgColor: wlget('bgColor') || '#304156',
	accentColour: wlget('accentColour') || '#1890FF',
	size: wlget('size') || 'medium',
	rightLineX: '200px',
	tabsList: [
		{
			name: '首页',
			closable: false, //是否可以删除
			isShow: true,
			componentName: 'Welcome',
			path: '/welcome',
		},
	],
	sideMenuList: [],
	// keep-alive 缓存
	cacheViews: [],
	defaultActive: '',
	isCacheViews:
		JSON.parse(wlget('isCacheViews')) != null
			? JSON.parse(wlget('isCacheViews'))
			: false,
	isOpenTabbar:
		JSON.parse(wlget('isOpenTabbar')) != null
			? JSON.parse(wlget('isOpenTabbar'))
			: true,
}
const mutations = {
	CHANGE_CURFORMINFO(state, val) {
		state.curFormInfo = val
	},
	CHANGE_CURSCREENINFO(state, val) {
		state.curScreenInfo = val
	},
	CHANGE_ALLCOLOR(state) {
		state.bgColor = '#304156'
		state.accentColour = '#1890FF'
		wlset('bgColor', '#304156')
		wlset('accentColour', '#1890FF')
	},
	CHANGE_ISOPENTABBAR(state, value) {
		state.isOpenTabbar = value
		wlset('isOpenTabbar', value)
	},
	CHANGE_ISCACHEVIEWS(state, value) {
		state.isCacheViews = value
		wlset('isCacheViews', value)
	},
	CHANGE_RIGHTLINEX(state, value) {
		state.rightLineX = value
	},
	CHANGE_SIZE(state, value) {
		state.size = value
		wlset('size', value)
	},
	CHANGE_BGCOLOR(state, value) {
		state.bgColor = value
		wlset('bgColor', value)
	},
	CHANGE_ACCENTCOLOUR(state, value) {
		state.accentColour = value
		wlset('accentColour', value)
	},
	CHANGE_ISCOLLAPSE(state) {
		state.isCollapse = !state.isCollapse
	},
	CHANGE_TABSLIST(state) {
		const arr = JSON.parse(wl.getItem('tabsList'))
		if (arr && arr.length > 0) {
			state.tabsList = arr
			state.cacheViews = arr.map(i => i.componentName)
		} else {
			state.tabsList = [
				{
					name: '首页',
					closable: false, //是否可以删除
					isShow: true,
					componentName: 'Welcome',
					path: '/welcome',
				},
			]
		}
	},
	UPDATE_TABSLIST(state, arr) {
		if (!Array.isArray(arr)) arr = [arr]
		const res = state.tabsList.find(i => i.path === arr[0].path)
		if (res) return
		state.tabsList = state.tabsList.concat(arr)
		state.cacheViews = state.cacheViews.concat(arr.map(i => i.componentName))
		wl.setItem('tabsList', JSON.stringify(state.tabsList))
	},
	UPDATE_TABSLIST_FORM(state, arr) {
		let res = arr[0]
		const index = state.tabsList.findIndex(i => i.path === res.path)
		if (index != -1) {
			state.tabsList.splice(index, 1, res)
		} else {
			state.tabsList = state.tabsList.concat(arr)
			state.cacheViews = state.cacheViews.concat(arr.map(i => i.componentName))
		}
		wl.setItem('tabsList', JSON.stringify(state.tabsList))
	},
	REMOVE_CACHEVIEWS(state, name) {
		let index = state.cacheViews.findIndex(i => i === name)
		state.cacheViews.splice(index, 1)
	},
	UPDATE_CACHEVIEWS(state, name) {
		let target = state.cacheViews.find(i => i === name)
		if (!target) {
			state.cacheViews.push(target)
		}
	},
	CLOSETAB(state, path) {
		state.tabsList.forEach((i, index) => {
			if (i.path === path) {
				if (i.bigscreen) {
					state.curScreenInfo = null
				} else if (i.formGenerator) {
					state.curFormInfo = null
				}
				state.tabsList.splice(index, 1)
				let cur = state.cacheViews.findIndex(
					j => j.componentName == i.componentName,
				)
				state.cacheViews.splice(cur, 1)
			}
		})
		wl.setItem('tabsList', JSON.stringify(state.tabsList))
	},
	CHANGE_SIDEMENULIST(state, arr) {
		state.sideMenuList = arr
	},
	CHANGE_DEFAULTACTIVE(state, path) {
		state.defaultActive = path
	},
}
const actions = {
	OPEN_CACHEVIEWS({ commit }, name) {
		commit('CHANGE_TABSLIST')
		if (name) {
			commit('UPDATE_CACHEVIEWS')
		}
	},
	ACTION_CHANGE_CURFORMINFO({ commit }, val) {
		return new Promise(res => {
			commit('CHANGE_CURFORMINFO', val)
			res(true)
		})
	},
	ACTION_CHANGE_CURSCREENINFO({ commit }, val) {
		return new Promise(res => {
			commit('CHANGE_CURSCREENINFO', val)
			res(true)
		})
	},
}
export default {
	namespaced: true,
	state,
	mutations,
	actions,
}
